<template>
	<view class="">
		<view>
			<!-- <u-swiper :list="info.images" height="750"></u-swiper> -->
			<u-image :src="info.cover" width="750" height="750"></u-image>
			<view class="nav_row ">
				<view v-for="(item,index) in nav" :key="index">
					<u-image :src="item" width="180" height="62"></u-image>
				</view>
			</view>

			<view style="padding: 20rpx;font-weight: bold;font-size: 32rpx;">{{info.goodsName}}</view>

			<view class="u-flex u-row-between u-padding-20">
				<view style="color:#FF6450"><text style="font-size: 56rpx;color:#FF6450;">{{info.bargainSuccessNum}}</text>人已免费拿</view>
				<view tyle="color:#999">价值{{info.price}}元</view>
			</view>


			<view class="bootomfix" @click="btn">
				点击免单
			</view>

<size ref="chilren"></size>
<sure ref="chilrensure"></sure>
		</view>
	</view>
</template>

<script>
	import sure from "./components/sure.vue"
	import size from "@/pages/shop/components/size.vue"
	export default {
		components: {
			size,
			sure
		},
		watch:{
			surepop:{
				immediate: true,
				handler(v){
					
					if(v){
						this.$refs.chilrensure.show=true,
						this.$refs.chilrensure.info=this.info
					}else{
						
					}
					
				}
			},
		},
		data() {
			return {
				info: {
					goodsName: "",
					price: "",
					linePrice: "",
					expressFee: '',
					detail: "",
					spec:[],
					images:[],
					total:""
				},
				id: "",
			    surepop:false,
				nav: ['/static/kanjiantitle_1.png', '/static/kanjiantitle_2.png', '/static/kanjiantitle_3.png']
			}
		},
		methods: {
			btn(){
				this.$refs.chilren.show = true;
				// 砍价商品
				this.$refs.chilren.statusing = 4;
				setTimeout(() => {
					this.$refs.chilren.info = this.info
				}, 0)
			},
			detail() {
				this.$u.post('/api/index/goodsDetail', {
					goods_id: this.id,
				}, {}).then(res => {
					
					this.info=res.data

				}).catch(err => {})
			}
		},
		onLoad(options) {
			if (options.id) {
				this.id = options.id
			}
			this.detail()

		},
	}
</script>

<style>
	.nav_row {
		display: flex;
		justify-content: space-around;
		background: linear-gradient(180deg, #FB5E3F 0%, #FDDFA9 100%);
		padding: 20rpx;
	}

	.bootomfix {
		position: fixed;
		width: 750rpx;
		height: 120rpx;
		left: 0;
		bottom: 0;
		color: #fff;
		line-height: 120rpx;
		text-align: center;
		font-size: 40rpx;
		background: #FF6450;
	}
</style>
